<!DOCTYPE html>
<html>

<head>
  <meta charset="utf-8">
  <title>layuiAdmin 后台管理员</title>
  <meta name="renderer" content="webkit">
  <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
  <meta name="viewport"
    content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=0">
  <link rel="stylesheet" href="__STATIC__/layuiadmin/layui/css/layui.css" media="all">
  <link rel="stylesheet" href="__STATIC__/layuiadmin/style/admin.css" media="all">

</head>

<body>

  <div class="layui-fluid">
    <div class="layui-card">
      <div class="layui-form layui-card-header layuiadmin-card-header-auto">
        <div class="layui-form-item">
          <div class="layui-inline">
            <label class="layui-form-label">微信分组</label>
            <div class="layui-input-block">
              <input type="text" name="groupname" placeholder="请输入微信分组" autocomplete="off" class="layui-input">
            </div>
          </div>
          <div class="layui-inline">
            <button class="layui-btn layuiadmin-btn-admin" lay-submit lay-filter="LAY-user-back-search">
              <i class="layui-icon layui-icon-search layuiadmin-button-btn"></i>
              搜索
            </button>
            <button class="layui-btn layuiadmin-btn-admin" data-type="refresh">
              <i class="layui-icon layui-icon-refresh-1 layuiadmin-button-btn"></i>
              刷新
            </button>
          </div>
        </div>
      </div>

      <div class="layui-card-body">
        <div style="padding-bottom: 10px;">
          <button class="layui-btn layuiadmin-btn-admin" data-type="add">添加</button>
        </div>
        <table id="LAY-user-back-manage" lay-filter="LAY-user-back-manage"></table>


        <script type="text/html" id="rolesTitle">
          {{# layui.each(d.roles,function(index,roles_title){}}
           {{ roles_title.title }}
          {{# }); }}
        </script>

        <script type="text/html" id="buttonTpl">

              {{#  if(d.status == 1){ }}
<!--              <button class="layui-btn layui-btn-xs">启用</button>-->
              <input type="checkbox" checked name="open" lay-skin="switch" lay-filter="switchTest" lay-text="启用|禁止">

              {{#  } else { }}
              <input type="checkbox"  name="open" lay-skin="switch" lay-filter="switchTest" lay-text="启用|禁止">
<!--              <button class="layui-btn layui-btn-primary layui-btn-xs">禁止</button>-->
              {{#  } }}

        </script>


        <script type="text/html" id="table-useradmin-admin">
                   <a class="layui-btn layui-btn-warm layui-btn-xs " lay-event="addwx"><i class="layui-icon layui-icon-edit"></i>添加微信</a>
                    <a class="layui-btn layui-btn-normal layui-btn-xs " lay-event="catchurl"><i class="layui-icon layui-icon-share"></i>获取调用链接</a>
                    <a class="layui-btn layui-btn-warm layui-btn-xs " lay-event="showCopy" ><i class="layui-icon layui-icon-share"></i>展现和复制次数</a>
                  
                    <a class="layui-btn layui-btn-normal layui-btn-xs " lay-event="addAll"><i class="layui-icon layui-icon-edit"></i>批量添加</a>
                    <a class="layui-btn layui-btn-danger layui-btn-xs " lay-event="del"><i class="layui-icon layui-icon-delete"></i>删除</a>
                </script>




      </div>
    </div>
  </div>

  <script src="__STATIC__/layuiadmin/layui/layui.js"></script>
  <script>

    layui.config({
      debug: false //用于开启调试模式，默认 false，如果设为 true，则JS模块的节点会保留在页面
      , base: '__STATIC__/layuiadmin/' //静态资源所在路径
    }).extend({
      index: 'lib/index' //主入口模块
    }).use(['index', 'table'], function () {
      var $ = layui.$
        , form = layui.form
        , table = layui.table;

      table.render({
        elem: '#LAY-user-back-manage'
        , url: 'index'
        , method: "post"
        , toolbar: '#toolbarDemo' //开启头部工具栏，并为其绑定左侧模板
        , title: '用户数据表'
        , limit: 10
        , cols: [[
          { title: 'ID', fixed: 'left', type: 'numbers' }
          // ,{field:'levelName', title:'目录_结构',templet: '#titleTpl' }
          // , { field: 'id',title: 'id',hide: true}
          , { field: 'groupname', title: '微信分组名称',fixed: 'left',sort:true}
          , { field: 'describe', title: '分组描述'}
          , { field: 'create_time', title: '添加时间' ,width:200,sort:true}
          , { field: 'update_time', title: '更新时间' ,width:200,sort:true}
          // , { field: 'status', title: '状态', toolbar: '#buttonTpl', event: 'setSign', style: 'cursor: pointer;', width: 100 }
          , { title: '操作', toolbar: '#table-useradmin-admin', width:500 }
        ]]
        , page: true
        , parseData: function (res) { //将原始数据解析成 table 组件所规定的数据，res为从url中get到的数据
          var result;
          // console.log(this);
          // console.log(JSON.stringify(res));
          if (this.page.curr) {
            result = res.data.slice(this.limit * (this.page.curr - 1), this.limit * this.page.curr);
          }
          else {
            result = res.data.slice(0, this.limit);
          }
          return {
            "code": res.code, //解析接口状态
            "msg": res.msg, //解析提示文本
            "count": res.count, //解析数据长度
            "data": result //解析数据列表
          };
        }
      });

      //监听搜索
      form.on('submit(LAY-user-back-search)', function (data) {
        var field = data.field;
        console.log(field);


        //执行重载
        table.reload('LAY-user-back-manage', {
          where: field
        });
      });



      //事件
      var active = {
        add: function () {
          
          layer.open({
            type: 2
            , title: '添加分组'
            , content: 'create'
            , area: ['450px', '400px']
            , offset: [ //为了演示，随机坐标
              Math.random() * ($(window).height() / 2 - 225)
              , Math.random() * ($(window).width() / 2 - 200)
            ]
            , fixed: false //不固定
            , maxmin: true
            , btn: ['确定', '取消']
            , yes: function (index, layero) {
              var iframeWindow = window['layui-layer-iframe' + index]
                , submitID = 'LAY-wx-create-submit'
                , submit = layero.find('iframe').contents().find('#' + submitID);

              //监听提交
              iframeWindow.layui.form.on('submit(' + submitID + ')', function (data) {
                var field = data.field; //获取提交的字段
                console.log(field);
                //提交 Ajax 成功后，静态更新表格中的数据
                $.ajax({
                  type: "POST",
                  url: "create",
                  dataType: "json",
                  data: field,
                  success: function (res) {
                    console.log(res);
                    if (res['code'] == 1) {
                      layer.msg(res['msg'], { icon: 1, time: 1000 }, function () {
                        table.reload('LAY-user-back-manage');
                        // layer.close(index1); //关闭弹层
                        layer.close(index); //关闭弹层
                      });
                    } else {
                      layer.msg(res['msg'], { icon: 2, time: 1000 }, function () {
                      });
                    }
                  }
                });

              });

              submit.trigger('click');
            }
          });
        },
        // 在进行微信分组搜索后，点击刷新获取所有数据
        refresh:function(){
            //执行重载
            table.reload('LAY-user-back-manage', {
              where: ''
            });
        }

      };
      $('.layui-btn.layuiadmin-btn-admin').on('click', function () {
        var type = $(this).data('type');
        active[type] ? active[type].call(this) : '';
      });




      //监听行工具事件
      table.on('tool(LAY-user-back-manage)', function (obj) {
        var data = obj.data;
        console.log(data.id);
        if (obj.event === 'del') {
          layer.confirm('确认删除{ '+data.groupname+' }分组吗？删除后将无法返回！', function (index) {
            $.ajax({
              type: "GET",
              url: 'deleteGropu',
              data: data,
              dataType: "json",
              success: function (res) {
                // console.log(res);
                if (res['code'] == 1) {
                  layer.msg(res['msg'], { icon: 1, time: 1000 }, function () {
                    obj.del();
                    layer.close(index);
                  });
                }
              }
            });


          });
        } else if (obj.event === 'addwx') {

          layer.open({
            type: 2,
            title:'{'+data.groupname+'}分组添加微信',
            area: ['1000px', '700px'],
            fixed: false, //不固定
            maxmin: true,
            content: 'addwx?id=' + data.id,
            // btn: ['确定', '取消'],
            yes: function (index, layero) {
              var iframeWindow = window['layui-layer-iframe' + index]
                , submit = layero.find('iframe').contents().find("#LAY-add-route-submit");
              //监听提交
              iframeWindow.layui.form.on('submit(LAY-add-route-submit)', function (data) {
                var field = data.field; //获取提交的字段
                // console.log(field);
                //提交 Ajax 成功后，静态更新表格中的数据
                //loading层
                var index1 = layer.load(1, {
                  shade: [0.1, '#fff'], //0.1透明度的白色背景
                  time: 1000
                });
                $.ajax({
                  url: 'update',
                  type: "POST",
                  data: field,
                  dataType: "json",
                  success: function (res) {
                    console.log(res['code']);
                    if (res['code'] == 1) {
                      layer.msg(res['msg'], { icon: 1, time: 1000 }, function () {
                        table.reload('LAY-user-back-manage');
                        layer.close(index1); //关闭弹层
                        layer.close(index); //关闭弹层
                      });
                    }
                  }
                });
              });
              submit.trigger('click');
            },
            btn2: function () {
              layer.closeAll();
            }
          });
        }

        //批量添加

        if (obj.event === 'addAll') {
          layer.open({
            type: 2,
            title:'{'+data.groupname+'}分组批量添加微信',
            area: ['700px', '700px'],
            fixed: false, //不固定
            maxmin: true,
            content: 'addAll?id=' + data.id,
            // btn: ['确定', '取消'],
            yes: function (index, layero) {
              var iframeWindow = window['layui-layer-iframe' + index]
                , submit = layero.find('iframe').contents().find("#LAY-add-route-submit");
              //监听提交
              iframeWindow.layui.form.on('submit(LAY-add-route-submit)', function (data) {
                var field = data.field; //获取提交的字段
                // console.log(field);
                //提交 Ajax 成功后，静态更新表格中的数据
                //loading层
                var index1 = layer.load(1, {
                  shade: [0.1, '#fff'], //0.1透明度的白色背景
                  time: 1000
                });
                $.ajax({
                  url: 'update',
                  type: "POST",
                  data: field,
                  dataType: "json",
                  success: function (res) {
                    console.log(res['code']);
                    if (res['code'] == 1) {
                      layer.msg(res['msg'], { icon: 1, time: 1000 }, function () {
                        table.reload('LAY-user-back-manage');
                        layer.close(index1); //关闭弹层
                        layer.close(index); //关闭弹层
                      });
                    }
                  }
                });
              });
              submit.trigger('click');
            },
            btn2: function () {
              layer.closeAll();
            }
          });
        }



        //获取调用方式

        if (obj.event === 'catchurl') {
          console.log(obj.data);
          layer.open({
            type: 2,
            title:'{'+data.groupname+'}调用链接',
            area: ['900px', '800px'],
            fixed: false, //不固定
            maxmin: true,
            content: 'catchurl?id=' + obj.data.id,
            // btn: ['确定', '取消'],
            yes: function (index, layero) {
              var iframeWindow = window['layui-layer-iframe' + index]
                , submit = layero.find('iframe').contents().find("#LAY-add-route-submit");
              //监听提交
              iframeWindow.layui.form.on('submit(LAY-add-route-submit)', function (data) {
                var field = data.field; //获取提交的字段
                // console.log(field);
                //提交 Ajax 成功后，静态更新表格中的数据
                //loading层
                var index1 = layer.load(1, {
                  shade: [0.1, '#fff'], //0.1透明度的白色背景
                  time: 1000
                });
                $.ajax({
                  url: 'update',
                  type: "POST",
                  data: field,
                  dataType: "json",
                  success: function (res) {
                    console.log(res['code']);
                    if (res['code'] == 1) {
                      layer.msg(res['msg'], { icon: 1, time: 1000 }, function () {
                        table.reload('LAY-user-back-manage');
                        layer.close(index1); //关闭弹层
                        layer.close(index); //关闭弹层
                      });
                    }
                  }
                });
              });
              submit.trigger('click');
            },
            btn2: function () {
              layer.closeAll();
            }
          });
        }

        //展示和复制次数

        if (obj.event === 'showCopy') {
          console.log(obj.data);
          layer.open({
            type: 2,
            title:'{'+data.groupname+'}分组展示和复制次数统计',
            area: ['600px', '600px'],
            fixed: false, //不固定
            maxmin: true,
            content: 'showCopy?id=' + obj.data.id,
            // btn: ['确定', '取消'],
            yes: function (index, layero) {
              var iframeWindow = window['layui-layer-iframe' + index]
                , submit = layero.find('iframe').contents().find("#LAY-add-route-submit");
              //监听提交
              iframeWindow.layui.form.on('submit(LAY-add-route-submit)', function (data) {
                var field = data.field; //获取提交的字段
                // console.log(field);
                //提交 Ajax 成功后，静态更新表格中的数据
                //loading层
                var index1 = layer.load(1, {
                  shade: [0.1, '#fff'], //0.1透明度的白色背景
                  time: 1000
                });
                $.ajax({
                  url: 'update',
                  type: "POST",
                  data: field,
                  dataType: "json",
                  success: function (res) {
                    console.log(res['code']);
                    if (res['code'] == 1) {
                      layer.msg(res['msg'], { icon: 1, time: 1000 }, function () {
                        table.reload('LAY-user-back-manage');
                        layer.close(index1); //关闭弹层
                        layer.close(index); //关闭弹层
                      });
                    }
                  }
                });
              });
              submit.trigger('click');
            },
            btn2: function () {
              layer.closeAll();
            }
          });
        }


        //修改使用状态
        if (obj.event === 'setSign') {
          console.log(1);
          console.log(obj.data);
          $.ajax({
            url: "exchangeStatus",
            type: "GET",
            data: obj.data,
            dataType: "json",
            success: function (res) {
              table.reload('LAY-user-back-manage');
              layer.msg(res['msg']);
            }
          })
        }



      });


    });
  </script>
</body>

</html>
